<template>
  <div p-20>
    <EvGrid :provide-config="provideConfig">
      <template #formSlot>
        <vxe-form-item field="name">
          <template #default="{ data }">
            <vxe-input v-model="data.name" type="text" placeholder="请输入名称"></vxe-input>
          </template>
        </vxe-form-item>
        <vxe-form-item>
          <template #default>
            <vxe-button type="submit" status="primary">查询</vxe-button>
            <vxe-button type="reset">重置</vxe-button>
          </template>
        </vxe-form-item>
      </template>
    </EvGrid>
  </div>
</template>

<script setup>
import { defineAsyncComponent } from 'vue'
import { getUsersList } from '@/api/user/index.js'
const EvGrid = defineAsyncComponent(() => import('@/components/vxe-table/EvGrid/index.vue'))
const provideConfig = {
  gridOptions: {
    columns: [
      { type: 'radio', width: 50, align: 'center' },
      { type: 'seq', width: 50, align: 'center' },
      { field: 'name', title: '账号' },
      { field: 'role', title: '权限' },
    ],
  },
  formData: {
    name: '',
  },
  getDataMethod: findList,
}
function findList(req) {
  return new Promise((resolve, reject) => {
    let params = {
      pageSize: 10,
      pageIndex: 1,
    }
    getUsersList(params).then((res) => {
      let { total, data } = res.data
      resolve({ data, total })
    })
  })
}
</script>

<style scoped></style>
